<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单进阶-下拉菜单</title>
</head>
<body>
    <h1>表单进阶-下拉菜单</h1>
    <div>
        <div>你的居住城市</div>
        <!-- select 支持的属性
        1.size 显示几个
        2.multiple 多选 ctrl+点击
        -->

         <!-- option 支持的属性
        1.value 提供给后端需要用的value值
        2.selected 默认选中
        -->
        <select size="1">
            <option value="tj">天津</option>
            <option value="bj">北京</option>
            <option value="">河北</option>
            <option value="">辽宁</option>
            <option selected>山东</option>
        </select>
    </div>
    <div>
        <select size="3" multiple>
            <option value="">足球</option>
            <option value="">篮球</option>
            <option value="" selected>排球</option>
            <option value="" selected>乒乓球</option>
            <option value="" selected>网球</option>
        </select>
    </div>
</body>
</html>